body{
    background: rgb(162, 162, 162);
}
.box-3d{
    position: relative;
    width: 100vw;
    height: 89vh;
}
.box-3d .container{
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    width: 60%;
    height: 60%;
    border: 5px solid rgb(255, 255, 255);
    border-radius: 20px;
}
.box-3d .cube{
    position: absolute;
    /* top: 50%; */
    /* left: 50%; */
    width: 300px;
    height: 300px;
    /* border: 1px solid red; */
    transform-style: preserve-3d; 
    position: relative;
    /* transform: translate(-50%,-50%) ; */
    transform: rotateY(45deg) rotateX(-10deg);
    animation: anim infinite linear 10s;
}
.box-3d .side{
    width: 300px;
    height: 300px;
    background: rgba(117, 117, 117,.5);
    position: absolute;
    top: 50%;
    left: 50%;
    text-align: center;
    line-height: 300px;
    border: 1px solid red;
}
.box-3d .front{
    transform:translate(-50%,-50%) translateZ(150px);
    background: url(../image/postman.svg) no-repeat center fixed;
    background-size: cover;
}
.box-3d .left{
    transform:translate(-50%,-50%) rotateY(90deg) translateZ(-150px);
    background: url(../image/java.jpeg) no-repeat center fixed;
    background-size: cover;
}
.box-3d .right{
    transform:translate(-50%,-50%) rotateY(-90deg) translateZ(-150px);
    background: url(../image/dw.png) no-repeat center fixed;
    background-size: cover;
}
.box-3d .top{
    transform:translate(-50%,-50%) rotateX(-90deg) translateZ(-150px);
    background: url(../image/ps.png) no-repeat center fixed;
    background-size: cover;
}
.box-3d .bottom{
    transform:translate(-50%,-50%) rotateX(90deg) translateZ(-150px);
    background: url(../image/python.jpeg) no-repeat center fixed;
    background-size: cover;
}
.box-3d .back{
    transform-origin: bottom;
    transform:translate(-50%,-50%) translateZ(-150px);
    background: url(../image/vsc.png) no-repeat center fixed;
    background-size: cover;
}
@keyframes anim {
    from{
        transform: rotateY(0deg) rotateX(0deg);
    }
    to{
        transform: rotateY(360deg) rotateX(-360deg);
    }
}